/**
 * Created by user on 2/18/19.
 */
import React from 'react'

import { connect } from 'react-redux'

import { MainAction } from '@act'

class GlobalBigImage extends React.Component {
  clickBigImage = () => {
    const { dispatch } = this.props
    const { toggleGlobalBigImage } = MainAction
    dispatch(toggleGlobalBigImage(''))
  }
  render() {
    const { big_image_url } = this.props
    return big_image_url ? (
      <div onClick={this.clickBigImage} className="global_big_image" style={{ backgroundImage: 'url(' + big_image_url + ')' }}></div>
    ) : null
  }
}

function mapState(state) {
  return {
    big_image_url: state.MainScreenState.bigImage
  }
}

export default connect(mapState)(GlobalBigImage)
